<template>
<el-scrollbar>
      <el-table  :data="tableData"
                 border
                 height="542px"
                 row-style="height:50px"
                 stripe style=" width: 100%"
                 tooltip-effect="dark">

        <el-table-column :index="getIndex" label="序号" type="index" width="60"/>
        <el-table-column label="发票名称"  prop="invoiceName" width="170"/>
        <el-table-column label="发票号码" prop="invoiceNum" width="170"/>
        <el-table-column label="开票日期" prop="createDate" width="145"/>
        <el-table-column fixed="right" label="操作"  width="170" prop="">
          <template #default="scope">
            <el-button   color="#97d578" plain  round size="default" @click="look(scope.row)">详细联系信息</el-button>
          </template>
        </el-table-column>
        <el-table-column label="购买方名称" prop="buyName" width="125"/>
        <el-table-column label="购买方识别码" prop="buyIdentity" width="121"/>
        <el-table-column label="购买方地址及电话"  prop="addressAndPhone" width="110"/>
        <el-table-column label="购买方开户行账户"  prop="account" width="110"/>
        <el-table-column label="合计"  prop="totalPrice" width="110"/>
        <el-table-column label="销售方名称"  prop="saleName" width="110"/>
        <el-table-column label="销售方识别码"  prop="saleIdentity" width="110"/>
        <el-table-column label="销售方地址及电话"  prop="saleAddressAndPhone" width="110"/>
        <el-table-column label="销售方开户行及账号"  prop="saleAddressAndPhone" width="110"/>
        <el-table-column label="收款人"  prop="getMoneyOne" width="110"/>
        <el-table-column label="复核人"  prop="review" width="110"/>
        <el-table-column label="开票人"  prop="billing" width="110"/>
        <el-table-column label="备注"  prop="note" width="110"/>


      </el-table>

      <el-dialog v-model="Visible" center title="详细商品信息" width="60%">
        <el-table :data="rowData" border>
          <el-table-column label="商品ID" prop="goodId" width="200"/>
          <el-table-column label="商品名称" prop="goodName" width="200"/>
          <el-table-column label="商品数量" prop="goodCount" width="200"/>
          <el-table-column label="商品价格" prop="price" width="200"/>
          <el-table-column label="商品税额" prop="tax" width="200"/>
          <el-table-column label="商品税率" prop="rate" width="200"/>
          <el-table-column label="计量单位" prop="measure" width="200"/>
           <el-table-column label="规格" prop="specificationsModels" width="200"></el-table-column>
        </el-table>
      </el-dialog>

      <el-pagination
          :current-page=pageNow
          :page-size=pageSize
          :page-sizes="[10,20,30,40]"
          :total=totalSize
          background
          layout="total, prev, pager, next"
          style="margin-top: 15px"
          @current-change="pageChange"
      >
      </el-pagination>

    </el-scrollbar>
</template>

<script>
import {request_financial} from "@/util/request";

export default {
name: "InvoiceManage",
  data(){
  return{
    Visible:false,
    rowData:[],
    tableData:[],
    pageNow:1,
    pageSize:10,
    totalSize:1,

  }
  },
  methods:{
    look(row){
      this.rowData=row.invoiceGoodInfoList
      this.Visible=true

    },

    //表格索引获取
    getIndex(index) {
      index = index + 1 + (this.pageNow - 1) * this.pageSize
      return index
    },
    //换页
    pageChange(val) {
      this.pageNow = val
      this.getAllOrders()
    },
  getInvoices(){
    request_financial.post("invoice/page",{
      pageSize:10,
      pageNow:1
    }).then(res=>{
      console.log(res.data)
        this.tableData=res.data.data.rowData

    })
  }
  },
  beforeMount() {
  this.getInvoices()
  }
}
</script>

<style scoped>

</style>